
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:yp/config/config.dart';
import 'package:get/get.dart';

import 'logic.dart';

class BindWelfareCardPage extends StatelessWidget {
  final logic = Get.put(BindWelfareCardLogic());
  final state = Get.find<BindWelfareCardLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Config.mainColor,
        brightness: Brightness.light,
        iconTheme: IconThemeData(color: Colors.white),
        title: Text(
          "福利卡",
          style: TextStyle(fontSize: 17),
        ),
        centerTitle: true,
      ),
      body: _buildBindWelfareCardPageBody(),
    );
  }

  Widget _buildBindWelfareCardPageBody() {
    return GetBuilder<BindWelfareCardLogic>(
      builder: (logic) {
        return SafeArea(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                color: Colors.white,
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    Container(
                      padding: EdgeInsets.symmetric(horizontal: 15),
                      child: Row(
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              "福利卡卡号",
                            ),
                          ),
                          Expanded(
                            child: Container(
                              alignment: Alignment.centerLeft,
                              child: TextField(
                                controller: logic.cardNumberTextEditingController,
                                decoration: InputDecoration(
                                    border: OutlineInputBorder(
                                        borderSide: BorderSide.none
                                    ),
                                    hintText: "请输入11位福利卡卡号",
                                    hintStyle: TextStyle(
                                        color: Color(0xffcccccc),
                                        fontSize: 14
                                    )
                                ),
                                inputFormatters: [
                                  LengthLimitingTextInputFormatter(11)
                                ],
                                style: TextStyle(textBaseline: TextBaseline.alphabetic),
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      child: Divider(height: 1),
                    ),
                    Container(
                      padding: EdgeInsets.symmetric(horizontal: 15),
                      child: Row(
                        children: [
                          Container(
                            child: Text(
                              "福利卡密码",
                            ),
                          ),
                          Expanded(
                            child: Container(
                              child: TextField(
                                controller: logic.passwordTextEditingController,
                                enableInteractiveSelection: false,
                                decoration: InputDecoration(
                                  border: OutlineInputBorder(
                                      borderSide: BorderSide.none
                                  ),
                                  hintText: "请输入密码",
                                  hintStyle: TextStyle(
                                      color: Color(0xffcccccc),
                                      fontSize: 14
                                  ),

                                  suffixIcon: IconButton(
                                    onPressed: () => logic.setPasswordShow(),
                                    icon: Icon(
                                      //根据passwordVisible状态显示不同的图标
                                      state.passwordShow == true ? Icons.visibility : Icons.visibility_off,
                                      color: Color(0xffcccccc),
                                    ),
                                  ),
                                ),
                                obscureText: !state.passwordShow,
                                inputFormatters: [
                                  LengthLimitingTextInputFormatter(30)
                                ],
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      child: Divider(height: 1),
                    ),
                  ],
                ),
              ),
              Container(
                color: Colors.amber,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Expanded(
                      child: Container(
                        child: TextButton(
                          child: Text(
                            "立即绑定",
                            style: TextStyle(color: Colors.white),
                          ),
                          onPressed: () => logic.bindBindWelfareCard(),
                        ),
                      ),
                    )
                  ],
                ),
              )
            ],
          ),
        );
      },
    );
  }

}
